<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			*{
			padding: 0;
			margin: 0 auto;
			box-sizing: border-box;
			}
			#container
			{
				width: 1200px;
				height: auto;
				
			}
			#header
			{
				float: left;
				width: 100%;
			}
			#context
			{
				float: left;
				width: 100%;
				margin-top: 10px;
				margin-left: 60px;
				margin-right: 60px;
			}
			#logo
			{
				float: left;
				margin-top: 10px;
   				margin-left:70px;
			}
			#tab
			{
				margin-top: 40px;
				padding-left: 10px;
				margin-left: 10px;
				float: left;
			    color:#FFFFFF;
			    font-size: 18px;
			}
			#tab div {
		    position: relative;
		    width: 70px;
		    height: 30px;
		    border: 1px solid #cccccc;
		    border-bottom: 0px;
		    text-align: center;
		    border-radius: 8%;
		    float: left;
		    margin-left: 10px;
		    background: aliceblue;
			}	
			#tab div  a{
			    position: absolute;
			    margin-top: 3px;
			    right: 18px;
			    font-weight: bold;
			     color: #006400;
			}
			#operator
			{
				float: right;
				font-size: 15px;
				color: #495FAE;
				margin-top: 5px;
				margin-right: 70px;
			}
			#mune
			{
				float: left;
				width: 100%;
				color:#FFFFFF;
				background:#EE7700 ;
				padding-top: 10px;
				padding-bottom: 10px;
			}
			#mune2
			{
				float: left;
				width: 100%;
				color:#000000;
				background:#D8D2CB ;
			}
			#location{
				float: left;
				margin-left: 60px;
				margin-top: 10px;
				font-size: 15px;
			}
			#left
			{
				float: left;
				width: 20%;
				border: #D8D2CB 1px solid;
				margin: 10px;
			}
			
			#right
			{
				float: left;
				width: 70%;
				margin: 10px;
			}
			#r2
			{
				float: left;
				width: 100%;
				margin: 10px;
				font-weight: bold;
			}
			#r1{
				float: right;
				margin-top: 10px;
			}
			#r1 div{
				float: left;
				font-size: 13px;
				border: #D8D2CB 1px solid;
				margin: 3px;
				color: #00478E;
				padding: 3px;
			}
			#lt2
			{
				background: #FAFAFA;
				color: #000000;
				 font-weight:bold;
				 padding: 10px;
			}
			#lt2 a{
				margin-left: 6px;
			}
			li{
				list-style: none;
				font-size: 15px;
				margin: 5px;
				padding-left: 10px;
			}
				#name{
				width: 60%;
				float: left;
			}
			#r3{
				width: 100%;
				float: left;
				margin: 10px;
				border: 1px #B55620 solid;border-left: 0px;border-right: 0px;border-bottom: 0px;
			}
			#con1{
				background: #F7F4EB;
				padding: 10px;
				color: #8B715B;	
				border-bottom: #D4CEB9 1px solid;
				font-weight: bold;
			}
			#con2{
				float: left;
				width: 100%;
				border: 1px #B55620 solid;border-left: 0px;border-right: 0px;border-top: 0px;
			}
			#id{
				float: left;
				width: 10%;
				padding: 10px;
				padding-left: 40px;
				border-right: #CCCCCC 1px solid; 
			}
			#name{
				float: left;
				width: 80%;
				padding: 10px;
				padding-left: 60px;
				border-right: #CCCCCC 1px solid; 
			}
			#mes{
				border-top: #CCCCCC 1px solid; 
			}
			
			#opt{
				padding: 10px;
			}
			#opt a{
				padding-left: 5px;
				color: #00478E;
			}
		</style>
	</head>
	<body>
		<div id="container">
			<div id="header">
				<div id="logo"><a border="1"><img src="../img/logo.gif" /></a></div>
				<div id="tab">
					<div style="float: left;"><a>首页</a></div>
			        <div style="float: left;"><a >用户</a></div> 
			        <div style="float: left;background: #EE7700;"><a style="color:#F0F8FF;">商品</a> </div>
			        <div style="float: left;"><a >订单</a> </div>
			        <div style="float: left;"><a>留言</a></div>
			        <div style="float: left;"><a>新闻</a> </div>
				</div>
				<div id="operator">
					<span style="background: url(../img/bg.png)0px -68px;">&nbsp;&nbsp;&nbsp;</span>
					<a href="shopping.html">购物车</a>
					<a href="login.html">登录</a>
					<a href="resiger.html">注册</a>
					<a href="guestbook.html">留言</a>
				</div>
			</div>
			<div id="mune">
				<a style="margin-right: 60px;float: right;">管理员pillys您好，今天是2012-12-21，欢迎回到管理后台.</a>
			</div>
			<div id="location">您现在的位置是:<a style="color: #95A2D0;">易卖网</a>><a >管理后台</a></div>
			<div id="context">
				<div id="left">
					<div>
						<div id="lt2" ><a>图书影像</a></div>
						<ul>
							<li>
								<span style="background: url(../img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>
								<a>用户管理</a><a style="float: right;">新增</a>
							</li>
						</ul>
					</div>
					<div>
						<div id="lt2" ><a>商品信息</a></div>
						<ul>
							<li>
								<span style="background: url(../img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>
								分类管理<a style="float: right;">新增</a>
							</li>
							<li>
								<span style="background: url(../img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>
								商品管理<a style="float: right;">新增</a>
							</li>
						</ul>
					</div>
					<div>
						<div id="lt2" ><a>订单管理</a></div>
						<ul>
							<li>
								<span style="background: url(../img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>
								订单管理
							</li>
						</ul>
					</div>
					<div>
						<div id="lt2" ><a>留言管理</a></div>
						<ul>
							<li>
								<span style="background: url(../img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>
								留言管理
							</li>
						</ul>
					</div>
					<div>
						<div id="lt2" ><a>新闻管理</a></div>
						<ul>
							<li>
								<span style="background: url(../img/bg.png)-238px -87px;">&nbsp;&nbsp;&nbsp;</span>
								新闻管理<a style="float: right;">新增</a>
							</li>
						</ul>
					</div>
				</div>
				<div id="right">
					<div id="r2">
						<span style="background: url(../img/bg.png)-235px -105px;">&nbsp;&nbsp;&nbsp;</span>
						<a>商品管理</a>
						<hr size="4" color="#EE7700">
					</div>
					
					<div id="r3">
						<div id="con1"><a style="padding-left: 3%;">ID</a>
							<a style="margin-left: 40%;">商品名称</a>
							<a style="margin-left: 40%;">操作</a>
						</div>
						<div id="con2">
							<div id="mes">
								<div id="id">1</div>
								<div id="name">铁三角 Audio-Technica ATH-EQ300M-SV 银色 挂耳式耳机</div>
								<div id="opt"><a>修改</a><a>删除</a></div>
							</div>
							<div id="mes">
								<div id="id">1</div>
								<div id="name">铁三角 Audio-Technica ATH-EQ300M-SV 银色 挂耳式耳机</div>
								<div id="opt"><a>修改</a><a>删除</a></div>
							</div>
						</div>
					</div>
					
			</div>
			<div id="mune2">
				<a style="margin-left: 35%;">Copyright &copy; 2016 东方睿智 All Rights Reserved.京ICP证1000001号</a>
			</div>
		</div>
	
	</body>
</html>
